.header .dv-dec-10,
.header .dv-dec-10-s {
  width: 33.3%;
  height: 5px;
}

.header .dv-dec-10-s {
  transform: rotateY(180deg);
}

.header .dv-dec-8 {
  width: 200px;
  height: 50px;
}

.header .title {
  position: relative;
  width: 500px;
  text-align: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.header .title .title-text {
  font-size: 24px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%);
}

.header .title .dv-dec-6 {
  position: absolute;
  bottom: -30px;
  left: 50%;
  width: 250px;
  height: 8px;
  transform: translate(-50%);
}

.header .aside-width {
  width: 40%;
}

.header .react-r-s,
.header .react-l-s {
  background-color: #0f1325;
}

.header .react-right {
  font-size: 18px;
  width: 300px;
  line-height: 50px;
  text-align: center;
  transform: skewX(-45deg);
}

.header .react-right.react-l-s {
  width: 500px;
}

.header .react-right .react-after {
  position: absolute;
  right: -25px;
  top: 0;
  height: 50px;
  width: 50px;
  background-color: #0f1325;
  transform: skewX(45deg);
}

.header .react-right .text {
  display: inline-block;
  transform: skewX(45deg);
}

.header .react-left {
  font-size: 18px;
  width: 300px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  transform: skewX(45deg);
  background-color: #0f1325;
}

.header .react-left.react-l-s {
  width: 500px;
  text-align: left;
}

.header .react-left .react-left {
  position: absolute;
  left: -25px;
  top: 0;
  height: 50px;
  width: 50px;
  background-color: #0f1325;
  transform: skewX(-45deg);
}

.header .react-left .text {
  display: inline-block;
  transform: skewX(-45deg);
}

.header .body-box {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
}

.header .body-box .content-box {
  display: grid;
  grid-template-columns: 2fr 3fr 5fr 3fr 2fr;
}

.header .body-box .bottom-box {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, 50%);
}
